{% extends "personal_center/base.html" %}

{% block page_link %}
    <link rel="stylesheet" href="../../static/system_setup/css/style.css">
    <link rel="stylesheet" type="text/css" href="../../static/personal_center/css/index.css">
    <link rel="stylesheet" type="text/css" href="../../static/personal_center/css/common.css">
    <script type="text/javascript" src="../../static/personal_center/js/index.js"></script>
{% endblock %}


{% block style %}
    <style>
        .add_class {
            background: #1E90FF;
        }

        .top_tag {
            border-bottom: #01AAED solid 3px;
            color: #01AAED;
        }

        .tab_top {
            width: 100px;
            height: 40px;
            line-height: 40px;
            text-align: center;
            display: inline-block;
            cursor: pointer;
        }
        .add-backbround-color {
            border-left: #1E90FF solid 3px;
            color: #1E90FF;
        }
        .span-class {
            border-radius: 3px; font-size: 10px; float: right; background: #8c939d; width: 25px; height: 20px; margin-top: 7px; line-height: 20px; text-align: center; display: table-row;color: white;
        }
        .shade {
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background-color: rgba(36, 36, 36, 0.5);
            display: none;
            z-index: 10000;
        }
        #addForm5 {
            width: 400px;
            height: 250px;
            background: #F5F5F5;
            position: absolute;
            border: #dfdfdf solid 1px;
            margin: auto;
            border-radius: 3px;
            top: 50%;
            left: 50%;
            /* 实现鼠标拖拽使用css3效果 */
            transform: translate(-50%, -50%);
            z-index: 10100;
            font-size: 0;
        }
        #title4 {
            display: flex;
            justify-content: space-between;
            text-align: right;
            box-sizing: border-box;
            padding: 0 10px;
            height: 40px;
            color: #0b0b0b;
            cursor: move;
            /*border: #dfdfdf solid 1px;*/
            width: 100%;background: #f4f7fa;border-top-left-radius: 5px;border-top-right-radius: 5px;
        }
        .button_style {
            width: 70px;border: #cfcfcf solid 0.5px;background: #cfcfcf;border-radius: 3px;margin-left: 10px;display: inline-block;vertical-align: top;
        }
        .button_style_active {
            width: 70px;border-radius: 3px;margin-left: 10px;display: inline-block;vertical-align: top;border: #00a0e9 solid 0.5px;background: #00a0e9;color: white;
        }
    </style>
{% endblock %}

{% block right_content %}
    <div id="new_models1" class="shade">
        <div id="new_models" style="width: 100%;height: 100%;position: absolute;">
            <div style="width: 500px;height: 200px;background: #F5F5F5;z-index: 10000;position: absolute;top: 50%;left: 50%;transform:translate(-50%,-50%);border-radius: 3px;border: #dfdfdf solid 1px;">
                <div id="box" style="width: 100%;height: 40px;background: #f4f7fa;cursor: move;border-top-left-radius: 5px;border-top-right-radius: 5px;line-height: 50px;border-bottom: #dfdfdf solid 1px;">
                    <div style="width: 20%;margin-left: 1%;display: inline-block;line-height: 0px;">
                        <h5 id="modal-title" class="modal-title" style="color: #727E8C;">
                            添加备注
                        </h5>
                    </div>
                    <span onclick="close_models()" style="float: right;padding-right: 2%;cursor: pointer;">
                        <i class="iconfont icon-quchu"></i>
                    </span>
                </div>
                <div style="height: 120px;width: 100%;border-bottom: #dfdfdf solid 1px;">
                    <textarea name="" id="remarks" cols="30" rows="10" style="width: 96%;height: 100px;margin-left: 2%;border: #cfcfcf solid 1px;outline: none;"></textarea>
                </div>
                <div style="width: 100%;height: 40px;text-align: right;padding-right: 2%;">
                    <button id="summit_but" style="width: 70px;height: 30px;border: #dfdfdf solid 1px;margin-top: 5px;border-radius: 3px;background: #1E90FF;color: white;">
                        提交
                    </button>
                </div>
            </div>
        </div>
    </div>
    {#    顶部导航    #}
    <div class="headline">
        <div id="my_application_tab" onclick="change_mind('my_application')" class="tab_top top_tag">
            我的待办
        </div>
        <div id="new_issues_tab" onclick="change_mind('new_issues')" class="tab_top">
            我的已办
        </div>
        <div id="my_dfet_tab" onclick="change_mind('my_dfet')" class="tab_top">
            我的申请
        </div>

        <div class="sa-ele" style="width: 80%;display: inline-block;text-align: right;font-size: 0;">
            <div style="height: 30px;display: none;vertical-align: top;margin-right: 15px;font-size: 14px;" id="flow_status_choose">
                <button class="button_style" name="button_style" onclick="ChooseFlow('1', this)">审核中</button>
                <button class="button_style" name="button_style" onclick="ChooseFlow('2', this)">传阅中</button>
                <button class="button_style" name="button_style" onclick="ChooseFlow('4', this)">完结</button>
                <button class="button_style" name="button_style" onclick="ChooseFlow('3', this)">拒绝</button>
            </div>
            <input type="text" name="search_val" style="width: 300px;display: inline-block;border-bottom-left-radius: 3px;border-top-left-radius: 3px;height: 30px;border: #0d8ddb solid 1px;vertical-align: top;font-size: 14px;padding-left: 2px;" placeholder="请输入搜索关键词">
            <button class="search-action" style="width: 100px;height: 30px;border-bottom-right-radius: 3px;border-top-right-radius: 3px;display: inline-block;font-size: 14px;border: #0d8ddb solid 1px;border-left: none;background: #0d8ddb;color: white;margin-left: -5px;">搜索</button>
        </div>
    </div>

    <div id="my_application" style="width: 100%;height: 95.3%;overflow: auto;background-color: white;">
        <div class="right-box" style="width: 100%;height: 100%;margin-top: 0;background: #F5F5F5;">
            <div id="left_nav" style="width: 20%;height: 100%;display: inline-block;vertical-align: top;background: white;margin-left: 5px; overflow: auto">
            </div>
            <div style="width: 78%;height: 100%;display: inline-block;vertical-align: top;background: white;">
                <div style="height: 100%;width: 100%;overflow: auto;background-color: white;border-bottom: #cfcfcf solid 1px;">
                    <section class="grid-main" style="height: 100%;">
                        <table></table>
                    </section>
                </div>
            </div>
        </div>
    </div>

    <div id="addForm4" class="shade" style="display: none;">
        <div id="addForm5">
            <div id="title4">
                <div style="width: 400px;height: 40px;line-height: 40px;display: inline-block;vertical-align: top;font-size: 13px;text-align: left;">
                    流程搁置
                </div>
                <div style="cursor: move;height: 40px;line-height: 40px;width: 140px;display: inline-block;vertical-align: top;"><i class="iconfont icon-quchu" onclick="close_models4()" style="cursor: pointer;"></i></div>
            </div>
            <hr>
            <div style="display: inline-block;width: 100%;height: 160px;border-right: #E8E8E8 solid 1px;font-size: 14px;border-bottom: #CCCCCC solid 0.5px;">
                <textarea name=""  id="flow-travel-tag" style="width: 100%;height: 160px;border: none;outline: none;"></textarea>
            </div>
            <div style="width: 100%;height: 42px;font-size: 14px;text-align: right;padding-right: 1%;">
                <button id="gezhi_button" style="width: 75px;height: 30px;border: #00a0e9 solid 0.5px;border-radius: 3px;background: #00a0e9;color: white;margin-top: 6px;">确认</button>
            </div>
        </div>
    </div>
{% endblock %}

{% block script %}
{#    <script type="text/javascript" src="../../static/system_setup/layer/2.4/layer.js"></script>#}
{#    <script type="text/javascript" src="../../static/system_setup/js/H-ui.js"></script>#}
{#    <script type="text/javascript" src="../../static/system_setup/js/H-ui.admin.page.js"></script>#}
    <script type="text/javascript" src="../../static/system_setup/laypage/1.2/laypage.js"></script>
    <script>
        window.onload = function () {
            window.s_type = 'audit';
            window.search_t = '2';
            document.getElementById("loading").style.display = "none";
            document.getElementById("personage").className = "add_class";
            document.getElementById("process_management").className = "add-nav-active";
            CreateRightContent('我的待办');
        };
        function choose_val(val_data) {
			document.getElementById("chooseval").innerText=val_data;
		}

        function do_stop(id) {
            document.getElementById("loading").style.display = "inline-block";
            var xhr = new XMLHttpRequest();
            var local_host = window.location.host;          // 获取当前IP
            xhr.open('post', "/administrative/official_documents_stop_view");
            xhr.setRequestHeader('content-type', 'application/x-www-form-urlencoded');
            xhr.setRequestHeader('Access-Control-Allow-Origin', '*');
            xhr.send("id=" + id);
            xhr.onreadystatechange = function () {
                if (xhr.readyState === 4) {
                    if (xhr.status === 200) {
                        document.getElementById("loading").style.display = "none";
                        var JsonDate = JSON.parse(xhr.responseText);
                        if (JsonDate["code"] === 200) {
                            alert("终止成功");
                            location.reload();
                            {#window.location.href="/personal-center/topic_discussion.html";#}
                        } else {
                            alert(JsonDate["message"]);
                        }
                    }
                }
            };
        }

        function do_lw_stop(id) {
            document.getElementById("loading").style.display = "inline-block";
            var xhr = new XMLHttpRequest();
            var local_host = window.location.host;          // 获取当前IP
            xhr.open('post', "/administrative/official_documents_stop_view");
            xhr.setRequestHeader('content-type', 'application/x-www-form-urlencoded');
            xhr.setRequestHeader('Access-Control-Allow-Origin', '*');
            xhr.send("id=" + id);
            xhr.onreadystatechange = function () {
                if (xhr.readyState === 4) {
                    if (xhr.status === 200) {
                        document.getElementById("loading").style.display = "none";
                        var JsonDate = JSON.parse(xhr.responseText);
                        if (JsonDate["code"] === 200) {
                            alert("终止成功");
                            location.reload();
                            {#window.location.href="/personal-center/topic_discussion.html";#}
                        } else {
                            alert(JsonDate["message"]);
                        }
                    }
                }
            };
        }

        function do_gw_stop(id) {
            document.getElementById("loading").style.display = "inline-block";
            var xhr = new XMLHttpRequest();
            var local_host = window.location.host;          // 获取当前IP
            xhr.open('post', "/administrative/conference_memo_stop_view");
            xhr.setRequestHeader('content-type', 'application/x-www-form-urlencoded');
            xhr.setRequestHeader('Access-Control-Allow-Origin', '*');
            xhr.send("id=" + id);
            xhr.onreadystatechange = function () {
                if (xhr.readyState === 4) {
                    if (xhr.status === 200) {
                        document.getElementById("loading").style.display = "none";
                        var JsonDate = JSON.parse(xhr.responseText);
                        if (JsonDate["code"] === 200) {
                            alert("终止成功");
                            location.reload();
                            {#window.location.href="/personal-center/topic_discussion.html";#}
                        } else {
                            alert(JsonDate["message"]);
                        }
                    }
                }
            };
        }

        function do_yt_stop(id) {
            document.getElementById("loading").style.display = "inline-block";
            var xhr = new XMLHttpRequest();
            var local_host = window.location.host;          // 获取当前IP
            xhr.open('post', "/administrative/topics_apply_stop_view");
            xhr.setRequestHeader('content-type', 'application/x-www-form-urlencoded');
            xhr.setRequestHeader('Access-Control-Allow-Origin', '*');
            xhr.send("id=" + id);
            xhr.onreadystatechange = function () {
                if (xhr.readyState === 4) {
                    if (xhr.status === 200) {
                        document.getElementById("loading").style.display = "none";
                        var JsonDate = JSON.parse(xhr.responseText);
                        if (JsonDate["code"] === 200) {
                            alert("终止成功");
                            location.reload();
                            {#window.location.href="/personal-center/topic_discussion.html";#}
                        } else {
                            alert(JsonDate["message"]);
                        }
                    }
                }
            };
        }

        function change_mind(ele_id) {
            if (ele_id === "my_application") {
                document.getElementById("my_application_tab").className = "tab_top top_tag";
                document.getElementById("new_issues_tab").className = "tab_top";
                document.getElementById("my_dfet_tab").className = "tab_top";
                window.s_type = 'audit'
                window.search_t = '2';
                CreateRightContent('我的待办');
            } else if (ele_id === "new_issues"){
                document.getElementById("my_application_tab").className = "tab_top";
                document.getElementById("new_issues_tab").className = "tab_top top_tag";
                document.getElementById("my_dfet_tab").className = "tab_top";
                window.s_type = 'already';
                window.search_t = '3';
                CreateRightContent('我的已办');
            }else {
                document.getElementById("my_dfet_tab").className = "tab_top top_tag";
                document.getElementById("new_issues_tab").className = "tab_top";
                document.getElementById("my_application_tab").className = "tab_top";
                window.s_type = 'apply';
                window.search_t = '1';
                CreateRightContent('我的申请');
            }
        }

        function create_left_nav(json_data, types) {
            console.log("types:: ", types)
            document.getElementById("left_nav").innerHTML = "";
            var left_nav = document.getElementById("left_nav");
            for (key in json_data) {
                var data_count = json_data[key]['count'];
                if (parseInt(json_data[key]['count']) > 99) {
                    data_count = '99+'
                }
                var div_tag = document.createElement("div");div_tag.style.width="95%";div_tag.style.height="35px";div_tag.style.lineHeight="35px";div_tag.style.cursor="pointer";div_tag.style.borderBottom='#cfcfcf solid 1px';
                var div_tag1 = document.createElement("div");div_tag1.style.paddingLeft="5px";div_tag1.setAttribute("onclick", "left_click_search('"+key+"')");div_tag1.innerText=key;div_tag1.setAttribute('data-value', key);div_tag1.className='onclick-search';
                var span_tag = document.createElement("span");span_tag.className="span-class";span_tag.innerText=data_count;
                if (types === "我的待办") {
                    if (json_data[key]['count'] !== 0){
                        span_tag.style.background="red";
                        span_tag.style.color='white';
                    }
                }
                div_tag1.appendChild(span_tag);div_tag.append(div_tag1)

                var div_tag3 = document.createElement("div");div_tag3.style.width="100%";div_tag3.id=key;div_tag3.style.display="none";div_tag3.style.cursor="pointer";
                for (var i=0; i<json_data[key]["data"].length; i++){
                    var data_count1 = json_data[key]['data'][i]["number"];
                if (parseInt(json_data[key]['data'][i]["number"]) > 99) {
                    data_count1 = '99+'
                }
                    var div_tag2 = document.createElement("div");div_tag2.style.width="95%";div_tag2.style.paddingLeft="35px";div_tag2.innerText=json_data[key]["data"][i]["type"];div_tag2.style.height="35px";div_tag2.setAttribute('data-value', json_data[key]["data"][i]["type"]);div_tag2.style.borderBottom='#cfcfcf solid 1px';
                    div_tag2.setAttribute("onclick", "change_font_color('"+json_data[key]["data"][i]["type"]+"')");div_tag2.className="div_tag2";div_tag2.style.lineHeight='35px';
                    var span_tag1 = document.createElement("span");span_tag1.className="span-class";span_tag1.innerText=data_count1;
                    if (types === "我的待办") {
                        if (json_data[key]['data'][i]["number"] !== 0){
                            span_tag1.style.background='';
                            span_tag1.style.color='red';
                        }
                    }
                    div_tag2.appendChild(span_tag1);div_tag3.appendChild(div_tag2);
                }
                left_nav.appendChild(div_tag);left_nav.appendChild(div_tag3);
            }
        }

        function CreateRightContent(types) {
            if (types !== '我的已办') {
                var columnData_data = [{key: "types", text: "流程类型", align: "center", disableMoveRow: !0}, {key: "title", text: "标题", align: "center", disableMoveRow: !0}, {key: "create_by", text: "创建人", align: "center" ,disableMoveRow: !0,}, {key: "department",text: "部门",align: "center",disableMoveRow: !0}, {key: "create_time", text: "创建时间", align: "center"}, {key: "node", text: "节点", align: "center"}, {key: "approved", text: "当前审核人", align: "center"}, {key: "action", width: "100px", align: "center", fixed: "right", disableMoveRow: !0, disableRowCheck: !0, text: '<span style="color: red">操作</span>', template: (e, t) => `<a class="plugin-action" href="${t.url}" onclick="${t.admin_add}">${t.text}</a>`}]
            } else {
                columnData_data = [{key: "types", text: "流程类型", align: "center", disableMoveRow: !0}, {key: "title", text: "标题", align: "center", disableMoveRow: !0}, {key: "create_by", text: "创建人", align: "center" ,disableMoveRow: !0,}, {key: "department",text: "部门",align: "center",disableMoveRow: !0}, {key: "create_time", text: "审批时间", align: "center"}, {key: "node", text: "节点", align: "center"}, {key: "approved", text: "当前审核人", align: "center"}, {key: "action", width: "100px", align: "center", fixed: "right", disableMoveRow: !0, disableRowCheck: !0, text: '<span style="color: red">操作</span>', template: (e, t) => `<a class="plugin-action" href="${t.url}" onclick="${t.admin_add}">${t.text}</a>`}]
            }
            const gridManagerName = "test",
            TYPE_MAP = {1: "HTML/CSS", 2: "nodeJS", 3: "javaScript", 4: "前端鸡汤", 5: "PM Coffee", 6: "前端框架", 7: "前端相关"},
            arg = {
                gridManagerName: "test",
                width: "100%",
                height: "100%",
                autoOrderConfig: {fixed: "left"},
                checkboxConfig: {key: "id", fixed: "left"},
                supportAjaxPage: !0,
                sortMode: "single",
                supportMenu: !0,
                menuHandler: e => (e.unshift({
                    content: "自定义菜单", line: !0, onClick: e => {
                    }
                }), e),
                useCellFocus: !0,
                useHideRow: !0,
                supportMoveRow: !0,
                moveRowConfig: {
                    key: "priority", useSingleMode: !0, fixed: "left", handler: (e, t) => {
                        console.log(e, t)
                    }
                },
                disableCache: !1,
                ajaxData: function (e, t) {
                    t['types'] = types
                    var local_host = window.location.host;          // 获取当前IP
                    // return document.querySelector('[name="type"]').value = t.type || -1, "https://www.lovejavascript.com/blogManager/getBlogList"
                    return "/administrative/flow_manage"

                },
                exportConfig: {
                    fileName: e => {
                        const t = new Date;
                        let a = `${t.getFullYear()}-${t.getMonth() + 1}-${t.getDate()}`;
                        for (let t in e) a = `${a}-${t}=${e[t]}`;
                        return a
                    }, suffix: "xls"
                },
                ajaxType: "POST",
                checkedBefore: function (e, t, a) {
                    return console.log("checkedBefore==", e, t, a), a && 90 === a.id && alert("该节点在checkedBefore中配置为不可选"), a && 90 !== a.id
                },
                ajaxSuccess: function (e) {
                    if (JSON.parse(e)["return_data"].length !== 0){
                        create_left_nav(JSON.parse(e)["return_data"], JSON.parse(e)["types"])
                    }
                },
                ajaxError: function (e) {
                    console.log("ajaxError")
                },
                ajaxBeforeSend: function (e) {
                    console.log("ajaxBeforeSend")
                },
                ajaxComplete: function (e) {
                    console.log("ajaxComplete")
                },
                adjustBefore: e => {
                    console.log("adjustBefore=>", e)
                },
                adjustAfter: e => {
                    console.log("adjustAfter=>", e)
                },
                responseHandler: e => (e.data.forEach((e => {
                    e.priority = e.id
                })), e),
                rowRenderHandler: (e, t) => e,
                emptyTemplate: e => `<div style="text-align: center;">${e.query.title ? "搜索为空" : "暂无数据"}</div>`,
                columnData: columnData_data
            }, demo1 = {
                initSearch: function () {
                    document.querySelector(".search-action").addEventListener("click", (function () {
                        if (!document.getElementsByClassName("onclick-search add-backbround-color")) {
                            alert("请选择需要检索的流程类型！")
                            return false
                        }
                        var data_value = document.getElementsByClassName("onclick-search add-backbround-color")[0].getAttribute("data-value");
                        var type_val = document.getElementsByClassName("tab_top top_tag")[0].innerText;
                        change_color(data_value);
                        var search_data = '';
                        var div_list = document.getElementsByClassName("div_tag2");
                        for (var j = 0; j < div_list.length; j++) {
                            console.log(div_list[j].style.color)
                            if (div_list[j].style.color==="rgb(30, 144, 255)"){
                                search_data = div_list[j].getAttribute("data-value")
                            }
                        }
                        var flow_names = "";
                        if (document.getElementById("flow_status_choose").style.display === "inline-block") {
                            flow_names = document.getElementById("flow_status_choose").value;
                        }
                        var e = {
                            datavalue: search_data,
                            search_val: document.querySelector('[name="search_val"]').value,
                            flow_name: flow_names,
                            types: type_val
                        };
                        table.GM("setQuery", e, (function () {
                            console.log("setQuery执行成功")
                        }))
                    }))
                }, initFN: () => {

                }, initGM: function () {
                    new window.GridManager(table, arg, (e => {
                        console.log("渲染完成后的回调函数:", e), console.log(arg.columnData)
                        var check_list = document.getElementsByClassName("display_none");
                        for (var i=0; i<check_list.length; i++) {
                            check_list[i].setAttribute("readonly", "ture");
                        }
                    }))
                }, editRowData: function (e) {
                    window.GridManager.updateRowData("test", "id", {
                        id: window.parseInt(e.getAttribute("data-id")),
                        lastDate: (new Date).getTime()
                    })
                }
            }, table = document.querySelector("table");
            demo1.initSearch(table), demo1.initGM(table), demo1.initFN();
        }

        var onlick_list = document.getElementsByClassName("onclick-search");

        function change_color(datavalue) {
            for (var j = 0; j < onlick_list.length; j++) {
                if (onlick_list[j].getAttribute("data-value") === datavalue) {
                    onlick_list[j].className = "onclick-search add-backbround-color";
                } else {
                    onlick_list[j].className = "onclick-search";
                }
            }
        }

        function left_click_search(data_value) {
            change_color(data_value);
            var tags = document.getElementById(data_value).style.display;
            if (tags === "none") {
                document.getElementById(data_value).style.display = "inline-block";
            }else {
                document.getElementById(data_value).style.display = "none";
            }
        }

        function change_font_color(data_value) {
            var div_list = document.getElementsByClassName("div_tag2");
            for (var j = 0; j < div_list.length; j++) {
                if (div_list[j].getAttribute("data-value") === data_value) {
                    div_list[j].style.color="#1E90FF";
                } else {
                    div_list[j].style.color="#0b0b0b";
                }
            }
            var type_val = document.getElementsByClassName("tab_top top_tag")[0].innerText;
            if (data_value === "上级来文" && type_val === "我的已办") {
                document.getElementById("flow_status_choose").style.display="inline-block";
            }else {
                document.getElementById("flow_status_choose").style.display="none";
            }
            var e = {
                datavalue: data_value,
                types: type_val
             };
            table = document.querySelector("table");
            table.GM("setQuery", e, (function () {
                console.log("setQuery执行成功")
             }))
        }

        function model_inlone(ele_id) {
            document.getElementById("new_models1").style.display = "table-row";
            document.getElementById("summit_but").setAttribute("onclick", "commit_remake('"+ele_id+"')");
        }

        let title = document.querySelector("#box");
        let addForm = document.querySelector("#new_models");

        title.addEventListener("mousedown", function (e) {
            let x = e.pageX - addForm.offsetLeft;
            let y = e.pageY - addForm.offsetTop;

            document.addEventListener("mousemove", move);
            function move(e) {
                addForm.style.left = e.pageX - x + 'px';
                addForm.style.top = e.pageY - y + 'px';
            }

            document.addEventListener("mouseup", function (e) {
                document.removeEventListener("mousemove", move);
            })
        });

        // 提交备注
        function commit_remake(ele_id) {
            var remarks = document.getElementById("remarks").value;
            if (!remarks) {
                alert("请填写备注！")
                return false
            }
            var xhr = new XMLHttpRequest();
            var local_host = window.location.host;          // 获取当前IP
            xhr.open('post', "/personal-center/Comments", true);
            xhr.setRequestHeader('content-type', 'application/x-www-form-urlencoded');
            xhr.send("received_id=" + String(ele_id)+"&remarks="+remarks);
            xhr.onreadystatechange = function () {
                if (xhr.readyState === 4) {
                    if (xhr.status === 200) {
                        var JsonDate = JSON.parse(xhr.responseText);
                        if (JsonDate['code'] === 200) {
                            console.log('JsonDate', JsonDate)
                            alert('添加成功！')
                            window.location.reload();
                        } else {
                            alert(JsonDate['message'])
                            window.location.reload();
                        }
                    }
                }
            }
        }

        function close_models() {
            document.getElementById("new_models1").style.display = "none";
        }

        function delete_flow(ele_id) {
            var r = confirm('是否删除改已办流程？')
            if (r) {
                document.getElementById("loading").style.display = "inline-block";
                var xhr = new XMLHttpRequest();
                var local_host = window.location.host;          // 获取当前IP
                xhr.open('post', "/system-setup/DeleteFlow", true);
                xhr.setRequestHeader('content-type', 'application/x-www-form-urlencoded');
                xhr.send("id=" + ele_id)
                xhr.onreadystatechange = function () {
                    if (xhr.readyState === 4) {
                        if (xhr.status === 200) {
                            document.getElementById("loading").style.display = "none";
                            var JsonDate = JSON.parse(xhr.responseText);
                            console.log(JsonDate);
                            alert(JsonDate['message'])
                            change_font_color("差旅报销")
                        }
                    }
                };
            }
        }

        function shelve_func(database_name, flow_id) {
            if (database_name !== '9') {
                alert("对不起！搁置功能暂时只运用于用印申请！")
                return false
            }
            var r = confirm('是否搁置该流程？')
            if (r) {
                var appave_opinion = document.getElementById("flow-travel-tag").value;
                document.getElementById("loading").style.display = "inline-block";
                var xhr = new XMLHttpRequest();
                var local_host = window.location.host;          // 获取当前IP
                xhr.open('post', "/system-setup/ShelveFlow", true);
                xhr.setRequestHeader('content-type', 'application/x-www-form-urlencoded');
                xhr.send("id=" + flow_id + "&database_name=" + String(database_name)+"&appave_opinion="+appave_opinion)
                xhr.onreadystatechange = function () {
                    if (xhr.readyState === 4) {
                        if (xhr.status === 200) {
                            document.getElementById("loading").style.display = "none";
                            var JsonDate = JSON.parse(xhr.responseText);
                            console.log(JsonDate);
                            alert(JsonDate['message'])
                            window.location.reload();
                        }
                    }
                };
            }
        }

        function close_models4() {
            document.getElementById("addForm4").style.display = "none";
        }

        function line_modes(database_name, flow_id) {
            document.getElementById("addForm4").style.display="table-row";
            document.getElementById("gezhi_button").setAttribute("onclick", "shelve_func('"+database_name+"', "+flow_id+")")
        }

        let title4 = document.querySelector("#title4");
        let addForm5 = document.querySelector("#addForm5");
        title4.addEventListener("mousedown", function (e) {
            let x = e.pageX - addForm5.offsetLeft;
            let y = e.pageY - addForm5.offsetTop;


            document.addEventListener("mousemove", move);
            function move(e) {
                addForm5.style.left = e.pageX - x + 'px';
                addForm5.style.top = e.pageY - y + 'px';
            }

            document.addEventListener("mouseup", function (e) {
                document.removeEventListener("mousemove", move);
            })
        });
        
        function ChooseFlow(flow_name, this_) {
            var e = {
                flow_name: flow_name
            };
            table.GM("setQuery", e, (function () {
                console.log("setQuery执行成功")
            }))
            var button_style_list = document.getElementsByName("button_style");
            for (var i=0; i<button_style_list.length; i++) {
                button_style_list[i].className = "button_style";
            }
            this_.className = "button_style_active";
        }
    </script>
{% endblock %}
